草庐IT

vue 组件的引用

全部标签

javascript - D3.js 4 与 AngularJS 1.5(组件或指令?)

我想在AngularJS1.5x中使用D3.jsv4过去我使用.directives作为图表,但现在我想知道是否可以使用.components代替指令,这是否是一个好的做法。CheckthesamplecaseonPlunkr问题出现在组件中的d3.select(element[0]).append('svg')中。控制台抛出错误:元素未定义。所以我尝试了类似d3.select('chart-container').append('svg')但随后d3在拥有该类的第一个元素中注入(inject)所有图表(在所有文档中查找该类,而不仅仅是组件)。那么...有人可以帮我为可重用组件做一个正

javascript - 如何使用 Vue.js 访问 API?

我是JavaScript和Vue.js的新手,我在使用Vue.js访问api时遇到问题。我尝试访问的API具有如下所示的JSON:{"coord":{"lon":-88.99,"lat":40.51},"weather":[{"id":800,"main":"Clear","description":"clearsky","icon":"01n"}],"base":"stations","main":{"temp":2.09,"pressure":1022.3,"humidity":69,"temp_min":2.09,"temp_max":2.09,"sea_level":1052.

javascript - 在 Vue JS 中处理登录 API token

我正在使用以下登录组件:varLogin=Vue.extend({template:'#auth',data:function(){return{username:'',password:'',errorMessage:''};},methods:{login:function(e){var_this=this;$.ajax({url:"/vue/api/login",type:"POST",async:false,data:{username:_this.username,password:_this.password},success:function(data){//storet

javascript - 输入 @keyup 事件在 Vue 中不起作用

我正在尝试调用按回车键的方法,但它不起作用。代码如下。Clickexportdefault{methods:{callEvent(){console.log("Eventcalled");}}} 最佳答案 click事件已经通过ENTER键触发(它在某些浏览器中也通过Space触发,例如桌面版Chrome)。因此,您的代码只需要一个@click="callEvent"并且一切正常,因为焦点已经在按钮上:varapp=newVue({el:"#app",methods:{callEvent(){console.log("Eventca

javascript - 如何使用 Vue.js 预加载图像?

我有一个使用Vue.Js(带有webpack)的小应用程序。我有一个过渡部分。当用户单击按钮时,内容将发生变化。这是一个带有IMG子元素的简单DIV元素。我的问题是当用户单击按钮时,下一张图像将实时加载并且速度很慢,所以我需要以某种方式预加载这些图像。我尝试了不同的方法,但无法实现预加载图像。问题:页面显示时只有第一张图片是DOM的一部分,其他图片不会加载。好的,这是正常行为。我无法通过对图像数组(PreloadingimageswithJavaScript)使用简单的for循环来预加载图像,因为每个请求都会通过唯一的查询字符串()来请求图像。因此预加载的图像名称将与请求的不匹配。我尝

javascript - 你如何引用 Array.prototype.slice.call()?

我正在编写一个脚本,其中我需要在许多不同的地方克隆数组。因此,我想执行以下操作来模拟克隆功能:varclone=[].slice.call;vararr1=[1,2,3,4,5,6,7,8,9,10];vararr2=clone(arr1,0);不幸的是,上面的代码导致:TypeError:objectisnotafunction。我意识到有很多功能可以进行深度克隆和浅拷贝,但我只想使用内置方法。有趣的是,以下确实有效:varclone=[].slice;vararr1=[1,2,3,4,5,6,7,8,9,10];vararr2=clone.call(arr1,0);有谁知道为什么第

javascript - 在 Javascript 中引用 window 对象的目的是什么?

window对象的每个属性都是一个全局变量。这意味着您可以执行以下操作:window.foo=42;alert(foo);//alerts42varbar=3;alert(window["bar"]);//alerts3正因为如此,我一直想知道在这样的代码中引用window的目的是什么if(window.prompt("EnterPassword")==="secret"){window.location.hash="authorized";window.open("secretPage.html");}当您可以省略window并使用完全相同的代码时:if(prompt("EnterP

javascript - 从组件触发路由 Action

我有一个组件,我想触发路由级别的操作,以便我可以转换到不同的路由。App=Ember.Application.create();App.Router.map(function(){});App.IndexRoute=Ember.Route.extend({actions:{complete:function(){//Thisneverhappens:(console.log('Triggeredcomplete!');}}});App.MyAreaComponent=Ember.Component.extend({actions:{clickMyButton:function(){co

javascript - 在一个文件而不是所有 JS 文件中引用 typescript 定义?

我正在VisualStudioCode中开发一个NodeJS(+Express)项目,想知道是否有一种方法可以在一个全局位置引用TypeScript定义,而不必在每个JS文件中重新引用定义.我看到VSCode支持tsconfigs,但我不认为.tsconfig文件有一个部分。 最佳答案 在某些编辑器中,您可以使用tsconfig.json中的filesGlob属性来简化引用。例如:"filesGlob":["./scripts/*.ts","!./node_modules/**/*.ts"]但是,这仅在TypeScript2发布时适

javascript - 具有大型数据集的组件仅在 IE11/Edge 上运行缓慢

考虑下面的代码。想象一下rows.length在此示例中,每个数组大约有8列,将达到2000或更多的任何值。我使用此代码的更扩展版本来呈现表格的一部分,这一直是我的Web应用程序的瓶颈。varGridBody=React.createClass({render:function(){return{this.props.Rows.map((row,rowKey)=>{returnthis.renderRow(row,rowKey);})};},renderRow:function(row,rowKey){return{row.map((col,colKey)=>{returnthis.r